/*
 * 自定义事件
 * -----------------------
 */
(function ($) {
    // 打开tab页
    $(".ajax-template").on("click", "a[target='navTab']", function () {
        var that = $(this);
        var _href = that.attr("href");
        $("#loading").show();

        $("#content>iframe").attr("src", _href);

        var height = $(document).height() - 27 - 58;
        $("#content>iframe").css("height", height);

        $("#loading").hide();
        if (that.parents(".sidebar-menu").length) {
            that.parent("li").addClass("active").siblings().removeClass("active");
        }
        return false;
    });


    var height = $(window).height();
    var topHeight = $(".main-header").height();
    var footer = $(".main-footer").height();
    $("#content").height(height - topHeight - footer - 4 + "px");


    /**
     * 资源 渲染
     */

    $.ajax({
        url: "/resources/tree",
        type: "post",
        dataType: "json",
        success: function (d) {
            if (d.code != 200) return;
            setTree(d.data.nodes);
        }
    })
}(jQuery));

/*
 树状图 原型
<li class="active treeview">
    <a href="#">
        <i class="fa fa-keyboard-o"></i> <span>主面板</span>
        <span class="pull-right-container"><i class="fa fa-angle-left pull-right"></i></span>
    </a>
    <ul class="treeview-menu">
        <li class="active"><a target="navTab" href="/page/list.html"><i class="fa fa-circle-o"></i>list页面</a></li>
        <li><a target="navTab" href="/page/tree.html"><i class="fa fa-paper-plane"></i>树形</a></li>
        <li><a target="navTab" href="/include/dashboard.html"><i class="fa fa-circle-o"></i> 面板 v1</a></li>
        <li><a target="navTab" href="/include/dashboard2.html"><i class="fa fa-circle-o"></i> 面板 v2</a></li>
    </ul>
</li>

<li><a target="navTab" href="/page/list.html"><i class="fa fa-circle-o"></i>list页面</a></li>

<li class="treeview">
    <a href="javascript:void(0);">
        <i class="fa fa-share"></i> <span>多级菜单</span>
        <span class="pull-right-container">
            <i class="fa fa-angle-left pull-right"></i>
        </span>
    </a>
    <ul class="treeview-menu">
        <li><a href="javascript:void(0);"><i class="fa fa-circle-o"></i> 一级菜单</a></li>
        <li>
            <a href="javascript:void(0);"><i class="fa fa-circle-o"></i> 一级菜单
                <span class="pull-right-container">
                    <i class="fa fa-angle-left pull-right"></i>
                </span>
            </a>
            <ul class="treeview-menu">
                <li><a href="javascript:void(0);"><i class="fa fa-circle-o"></i> 二级菜单</a></li>
                <li>
                    <a href="javascript:void(0);"><i class="fa fa-circle-o"></i> 二级菜单
                        <span class="pull-right-container">
                            <i class="fa fa-angle-left pull-right"></i>
                        </span>
                    </a>
                    <ul class="treeview-menu">
                        <li><a href="javascript:void(0);"><i class="fa fa-circle-o"></i> 三级菜单</a></li>
                        <li><a href="javascript:void(0);"><i class="fa fa-circle-o"></i> 三级菜单</a></li>
                    </ul>
                </li>
            </ul>
        </li>
        <li><a href="javascript:void(0);"><i class="fa fa-circle-o"></i> 一级菜单</a></li>
   </ul>
</li>
 */

/**
 * 勿格式化
 * 三 级树  不能在加
 */
function setTree(tree) {
    var str = "";
    $.each(tree, function (i, t) {
        if (t.type == "链接") {
            str += '<li><a target="navTab" href="' + t.url + '"><i class="' + t.style + '"></i>' + t.name + '</a></li>';
        } else {
            str += '<li class="treeview">';
            str += '<a href="#">';
            str += '<i class="' + t.style + '"></i><span>' + t.name + '</span>';
            str += '<span class="pull-right-container"><i class="fa fa-angle-left pull-right"></i></span>';
            str += '</a>';
            if (t.nodes) {
                str += '<ul class="treeview-menu">';
                $.each(t.nodes, function (x, y) {
                    if (y.type == "目录" && y.nodes) {
                        str += '<li>';
                        str += '<a href="#">';
                        str += '<i class="' + y.style + '"></i><span>' + y.name + '</span>';
                        str += '<span class="pull-right-container"><i class="fa fa-angle-left pull-right"></i></span>';
                        str += '</a>';
                        str += '<ul class="treeview-menu">';
                        $.each(y.nodes, function (o, p) {
                            str += '<li><a target="navTab" href="' + p.url + '"><i class="' + p.style + '"></i>' + p.name + '</a></li>';
                        });
                        str += '</ul>';
                        str += '</li>';
                    } else {
                        str += '<li><a target="navTab" href="' + y.url + '"><i class="' + y.style + '"></i>' + y.name + '</a></li>';
                    }
                });
                str += '</ul>';
            }
            str += '</li>';
        }

    });
    $("ul.sidebar-menu").html(str);
    $("ul.sidebar-menu a:eq(0)").click();
    $("ul.sidebar-menu ul>li>a:eq(0)").click();
}